var webpack = require('webpack');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var HtmlWebpackPlugin = require('html-webpack-plugin');

//环境变量的配置 分为dev/online 开发环境/线上环境
var WEBPACK_ENV = process.env.WEBPACK_ENV || 'dev';
console.log(WEBPACK_ENV);
//获取html-webpack-plugin参数的方法
var getHtmlConfig = function(name){
    return {
        template : './src/view/'+ name +'.html',
        filename : 'view/'+ name +'.html',
        inject   : true,
        hash     : true,
        chunks   : ['common',name]
    }
}
//webpack config
const config = {
    entry: {
        'common':['./src/page/common/index.js'],
        'index':['./src/page/index/index.js'],
        'login':['./src/page/login/index.js']
    },
    output: {
      filename: 'js/[name].js',
      path:'./dist',
      publicPath:'/dist'
    },
    externals:{
        'jquery': 'window.jquery' //用来加载外部的模块或者变量，这里是用jquery加载window下的jquery
    },
    module: {
        loaders: [
            {test: /\.css$/,loader: ExtractTextPlugin.extract('style-loader', 'css-loader') },
            {test: /\.(gif|png|jpg|woff|svg|eot|ttf)\??.*$/,loader: 'url-loader?limit=100&name=resouce/[name].[ext]'}
        ]  
    },
    plugins:[
        //独立通用模块到js/base.js
        new webpack.optimize.CommonsChunkPlugin({
            name :'common', //他会在执行webpack以后将该文件的内容转换为全局的模块
            filename :'js/base.js' //实际打包后的模块目录是dist/js/base.js
        }),
        //把css文件单独打包到文件里
        new ExtractTextPlugin('css/[name].css'),
        //处理html模板
        new HtmlWebpackPlugin(getHtmlConfig('index')),
        new HtmlWebpackPlugin(getHtmlConfig('login'))
    ]
};
if('dev' === WEBPACK_ENV ){
    config.entry.common.push('webpack-dev-server/client?http://localhost:8081/');
}
module.exports = config;